<template>
  <div class="movie">
    <h1>我想看的电影名字必须4-6的长度</h1>
    <ul>
      <li v-for="movie in myMovieList" :key="movie.tvId">
        {{ movie.albumName }}
      </li>
    </ul>
    <h2>我想看的电影名字是我传递的长度</h2>
    <ul>
      <li v-for="movie in yMovieList" :key="movie.tvId">
        {{ movie.albumName }}
      </li>
    </ul>
  </div>
</template>

<script>
import { mapGetters } from "vuex";
export default {
  name: "Movie",
  computed: {
    // myMovieList(){
    //     return this.$store.getters.myMovieList
    // }
    ...mapGetters(["myMovieList"]),

    // getter返回的如果是一个函数的话，可能需要传参，就不要使用mapGetters
    yMovieList() {
        // 当getters中计算属性的值是一个函数的时候，需要在使用的时候调用，然后传递参数
        // 通过方法访问时，每次都会进行回调，不会有缓存结果
      return this.$store.getters.yourMovieList({ start: 2, end: 4 });
    },
  },
};
</script>

<style>
</style>